<template>
	<div class="email">
		<div class="bigbox">
			<div class="email_left">
				<Search></Search>
	   		    <Tabs value="name1">
			        <TabPane label="推荐职位" name="name1">
			        	<div style="background:#eee;">
					        <Card :bordered="false">
					        	<div class="demo-split">
							        <Split v-model="split1">
							            <div slot="left" class="demo-split-pane">
							                <div slot="title" class="Card_head" @click="Position">前端组(Web前端开发工程师)中级</div>
					           				<div class="Card_mid">
					           					<ul class="Card_mid_ul">
					           						<li style="color: red;">7-11</li>
					           						<li>深圳</li>
					           						<li>本科及以上</li>
					           						<li>2年经验</li>
					           					</ul>
					           				</div>
					           				<div class="Card_foot_time">2019-03-30</div>
							            </div>
							            <div slot="right" class="demo-split-pane" style="padding-left: 30px;">
							                <div slot="title" class="Card_company"  @click="Company">三峡晓云信息服务邮电公司</div>
							                <div class="Card_foot_company">互联网/移动互联网/电子商务</div>
					           				<div class="Card_mid">
					           					<ul class="Card_company_ul">
					           						<li>年底双薪</li>
					           						<li>带薪年假</li>
					           						<li>扁平管理</li>
					           					</ul>
					           				</div>
							            </div>
							        </Split>
							    </div>
					        </Card>
					    </div>
			        </TabPane>
			        <TabPane label="今日精选" name="name2">
			        	<div style="background:#eee;">
					        <Card :bordered="false">
					        	<div class="demo-split">
							        <Split v-model="split1">
							            <div slot="left" class="demo-split-pane">
							                <div slot="title" class="Card_head">前端组(Web前端开发工程师)中级</div>
					           				<div class="Card_mid">
					           					<ul class="Card_mid_ul">
					           						<li style="color: red;">7-11</li>
					           						<li>深圳</li>
					           						<li>本科及以上</li>
					           						<li>2年经验</li>
					           					</ul>
					           				</div>
					           				<div class="Card_foot_time">2019-03-30</div>
							            </div>
							            <div slot="right" class="demo-split-pane" style="padding-left: 30px;">
							                <div slot="title" class="Card_company">三峡晓云信息服务邮电公司</div>
							                <div class="Card_foot_company">互联网/移动互联网/电子商务</div>
					           				<div class="Card_mid">
					           					<ul class="Card_company_ul">
					           						<li>年底双薪</li>
					           						<li>带薪年假</li>
					           						<li>扁平管理</li>
					           					</ul>
					           				</div>
							            </div>
							        </Split>
							    </div>
					        </Card>
						</div>
			        </TabPane>
	</Tabs>
			</div>
			<IndexR></IndexR>
		</div>
	</div>
</template>
<script>
	import IndexR  from './emailcomp/IndexR'
	import Search  from './emailcomp/Search'
	export default {
    	name: 'IndexEmail',
    	components: {
    	    IndexR,
    	    Search
    	},    
        data () {
            return {
                split1: 0.5,
                cityList1: [
                    {
                        value: '1',
                        label: '所有人都能看到'
                    },
                    {
                        value: '2',
                        label: '一度二度人脉能看到'
                    },
                    {
                        value: '3',
                        label: '只有一度人脉能看到'
                    },
                    {
                        value: '4',
                        label: '更多隐私设置'
                    }
                ],
                 cityList2: [
                    {
                        value: '1',
                        label: '开放简历'
                    },
                    {
                        value: '2',
                        label: '隐藏简历'
                    },
                    {
                        value: '3',
                        label: '仅猎头可见'
                    },
                    {
                        value: '4',
                        label: '仅企业可见'
                    },
                     {
                        value: '5',
                        label: '更多隐私设置'
                    }
                ],
                 cityList3: [
                    {
                        value: '1',
                        label: '开启'
                    },
                    {
                        value: '2',
                        label: '关闭'
                    },
                    {
                        value: '3',
                        label: '更多隐私设置'
                    }
                ],
                model1: '1',
                model2: '1',
                model3: '1'
            }
        },
        methods:{
        	Position(){
        		this.$router.push("/display")
        	},
        	Company(){
        		this.$router.push("/cintroduction")
        	}
        }
    }
</script>
<style>
	.email{
		width: 1000px;
		 position: relative;
	    left: 50%;
	    margin-left: -500px;
	}
	.bigbox{
		display: flex;
	}
	.email_left{
		width: 69%;
	}
	.email_right{
		width: 30%;
		margin-left: 15px;
	}
	 .demo-split{
        height: 110px;
        border: 1px solid #dcdee2;
    }
    .demo-split-pane{
        padding: 10px;
        font-size: 16px;
    }
    .Card_company{
    	cursor: pointer;
    }
    .Card_head{
    	font-size: 18px;
    	color: red;
    	cursor: pointer;
    }
    .Card_mid_ul,.Card_company_ul{
    	list-style: none;
    }
    .Card_mid_ul >li{
    	float: left;
    	margin-right: 15px;
    }
    .Card_company_ul>li{
    	float: left;
    	margin-right: 15px;
    	background: #999999;
    }
    .Card_mid{
    	margin-top: 15px;
    	display: inline-block;
    }
    .Card_foot_time{
    	font-size: 12px;
    }
    .ivu-card-body{
    	margin-bottom: 18px;
    	padding: 0;
    }
    .ivu-tabs{
    	margin-top: 20px;
    }
    .card{
    	padding-top: 20px;
    	padding-left: 20px;
    	padding-right: 20px;
    }
    .li_p{
	}
	.resume{
		display: inline-block;
	}
	.resume_ul{
		list-style: none;
	}
	.resume_ul>li{
		float: left;
		font-size: 13px;
		border-right: 1px solid;
		margin-top: 10px;
		width: 25%;
		text-align: center;
		height: 55px;
	}
	.credit{
		margin-top: 15px;
		padding-bottom: 10px;
		border-bottom: 1px dashed #CCCCCC;
	}
	.credit_p_foot{
		margin-top: 5px;
	}
	.email_right_top{
		display: flex;
	}
	.email_right_img{
		width: 100px;
		height: 100px;
		border: 1px solid red;
	}
	.email_right_img1{
		width: 100%;
	}
	.email_right_right{
		margin-left: 4px;
		margin-top: 15px;
	}
	.experience{
		border-bottom: 1px dashed #CCCCCC;
		margin-top: 10px;
		padding-bottom: 8px;
	}
	.right_foot_p{
		font-size: 17px;
		text-align: center;
		margin-top: 10px;
	}
	.button_foot{
		width: 100%;
		height: 45px;
		font-size: 20px;
		position: relative;
		bottom: -20px;
	}
	.button_foot_img{
		width: 100%;
		height: 45px;
		font-size: 20px;
		position: relative;
		bottom: -25px;
	}
	.right_foot{
		padding-top: 10px;
		padding-left: 20px;
		padding-right: 20px;
		background: #FFFFFF;
		height: 160px;
		margin-top: 20px;
	}
	.show_orange_p1{
		font-size: 15px;
	}
	.show_orange_p2{
		font-size: 16px;
	}
	.show_orange{
		width: 100%;
		height: 80px;
		border: 1px solid;
		background: #FF8250;
		color: #FFFFFF;
		padding-top: 20px;
		padding-left: 20px;
	}
	.show{
		background: #FFFFFF;
		padding: 20px;
		height: 365px;
	}
	.jianli_img{
		margin-top: 20px;
	}
	.card_jianli{
		padding-top: 5px;
		padding-left: 20px;
		padding-right: 20px;
	}
	.email_right_set_jianli{
		height: 20px;
		margin-top: 25px;
	}
	.jianli_p{
		font-size: 16px;
		height: 20px;
		display: inline-block;
		position: relative;
		top: -5px;
		font-weight: 700;
	}
	.title{
		width: 4px;
		height: 20px;
		background: #3D9CCC;
		display: inline-block;
		margin-right: 10px;
	}
	.experience_jianli{
		height: 106px;
		border-bottom: 1px solid;
	}

</style>
	